<template>

    <!-- 编辑文章内容页面 -->
    <div class="flex ">
        <div class="fixed w-full" style="height: 90%; padding-bottom: 10px;">
            <MdEditor v-model="text" :toolbars="toolbars" :preview="false"
                :theme="themeStatus.isDark ? 'dark' : 'light'" style="height: 100%;" 
                @onSave="saveContent"
                />

            <div class="fixed  w-full flex justify-center dark:bg-slate-800" style="height: 10%;">
                <span class="text-2xl dark:text-gray-400">©菜鸟拯救世界</span>
            </div>
        </div>


    </div>


    <div>

    </div>

</template>

<script setup>
import { ref, onMounted } from 'vue';
import { systemStatus } from '../../../ts/pinia';
import { MdEditor } from 'md-editor-v3';
import 'md-editor-v3/lib/style.css';
import { useRoute } from 'vue-router'
import { getUserArticleContentById } from '../../../ts/axios/articles';
let route = useRoute()
const articleId = Number(route.params.id)

// 系统
onMounted(async () => {
    let data = await getUserArticleContentById(articleId)
    // text.value = data.data.content
})


// -------------------------mdv3配置
let themeStatus = systemStatus() // 主题状态
// 编辑文章的标题栏 
const toolbars = ['italic', 'underline', 'bold', 'sub', 'sup', 'code', 'revoke', '-', 'save', '=', 'preview'];
let text = ref('');
// 

//---------------------------------- 请求接口
function saveContent(){//保存文章接口
    
}

</script>

<style scoped></style>